{% extends "admin/change_form.html" %}

{% block extrahead %}
	<link rel="stylesheet" href="http://localhost:8000/static/css/admin.css" type="text/css" media="screen" />
	<style tupe="text/css">
		// @import "http://o.aolcdn.com/dojo/0.9.0/dijit/themes/tundra/tundra.css";
	</style>
	<script type="text/javascript" src="/static/scripts/dojo/dojo.js" djConfig="parseOnLoad: true"></script>
	<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dojo.io.script");
dojo.require("dojo.io.iframe");
dojo.require("dojox.validate.isbn");
dojo.require("dijit.form.InlineEditBox");
dojo.require("dijit.form.CheckBox");
dojo.require("dijit.form.TextBox");
dojo.require("dojo.dnd.source");

var aws = {
	cache: null, 
	content: {
		Service: 'AWSECommerceService',
		SubscriptionId: '19267494ZR5A8E2CGPR2',
		AssociateTag: 'kokogiak7-20',
		Operation: 'ItemSearch',
		SearchIndex: 'Books',
		ResponseGroup: 'Medium,ItemAttributes,OfferFull',
		Keywords: null,
		Style: 'http://www.kunxi.org/files/learning-django-by-example/awsitems.xsl',
		ContentType: 'text/javascript',
		ItemPage: null,
	},
	selected: null,
}

function save() {
	var form = dojo.query("form")[0];
	// fetch meta from dnd:
	var meta = dojo.query("input[@name=meta]", form)[0];
	meta.value = dojo.toJson(
		dropbox.getItem(dropbox.getAllNodes()[0].id).data);

	// submit the form
	dojo.io.iframe.send({
		url: form.action,
		method: "post",
		handleAs: "json",
		form: form,
	}).addCallback(function(ret) {
		var msg = dojo.byId("billboard");
		switch(ret.status) {
		case 'Success':
			msg.innerHTML="Success.";
			msg.setAttribute("class", "message");
			break;

		case 'FileAlreadyExisted':
			msg.innerHTML="File already existed.";
			msg.setAttribute("class", "warning");
			break;

		case 'Error':
			msg.innerHTML = "Unexpected error.";
			msg.setAttribute("class", "error");
			break;
		}
		console.debug(msg);
		form.appendChild(msg);
	}); 
};

function suggestTags() {
	var suggested = dojo.byId("suggestedtags");
	var arr = ["linux", "java", "ruby"];
	var tags = dojo.query("input[@name=tags]")[0];
	dojo.forEach(arr, function(item) {
		var node = document.createElement("li");
		var html = "<a>"+item+"</a> "
		node.innerHTML = html;
		suggested.appendChild(node);
		dojo.connect(node, 'onclick', node, function() {
			tags.value += this.textContent;
			tags.value += ", ";
		});
	});
};

function clearAllChildren(el) {
	while(el.firstChild) {
		el.removeChild(el.firstChild);
	}
}

function _search() {
	var value = dojo.byId("search").value;
	if(dojox.validate.isValidIsbn(value)) {
		value = value.replace(/[- ]/g,''); //ignore dashes and whitespaces
	}
	aws.content.Keywords = escape(value);

	dojo.io.script.get({
		url: 'http://ecs.amazonaws.com/onca/xml',
		content: aws.content,
		callbackParamName: "CallBack",
	}).addCallback(function(result) {
		aws.cache = result.Items; // cache it for later use
		var thumbnails = dojo.byId("thumbnails");
		clearAllChildren(thumbnails);
		dojo.forEach(aws.cache, function(item) {
			node = document.createElement("li");
			dojo.addClass(node, "tablet");
			html = '<dl><dt><img src="' + item.thumburl 
					+ '"/></dt><dd><h3>' + item.title 
					+ '</h3> <p>by ' + item.authors.join(', ') 
					+ '</p><p>ISBN-10:' + item.isbn
					+ '</p><p>Publisher: ' + item.publisher + '</p>'
					+ '</dd> </dl>';
			node.innerHTML = html;
			thumbnails.appendChild(node);
			dojo.connect(node, "onclick", node, function() {
				if (aws.selected) {
					dojo.removeClass(aws.selected, "highlight");
				}
				aws.selected = this;
				dojo.addClass(this, "highlight");
			});
		});
		if (result.TotalPages > 1) {
			var nav = dojo.byId("search-nav");
			var prev = dojo.byId("prev");
			var next = dojo.byId("next");

			dojo.removeClass(nav, "hide");
			dojo.addClass(prev, "hide");
			dojo.addClass(next, "hide");
		
			if (aws.content.ItemPage > 1) {
				dojo.removeClass(prev, "hide");
			} 
			if (aws.content.ItemPage < result.TotalPages) {
				dojo.removeClass(dojo.byId("next"), "hide");
			}
		}
	});
};

function search() {
	aws.content.ItemPage = 1;
	_search();

}
function searchPrev() {
	aws.content.ItemPage--; 
	_search();
};

function searchNext() {
	aws.content.ItemPage++; 
	_search();
};




dojo.addOnLoad(function() {
	dojo.connect(dojo.byId("btn_search"), 'onclick', search);
	dojo.xhrGet({
		url: 'http://ecs.amazonaws.com/onca/xml',
		content: {
			dir: 'incoming'
		}
		}).addCallback(listdir);
});
	</script>
{% endblock %}

{% block content %}
<h1>Add Book by Search</h1>
<div class="third">
	<div class="box">
		<h2>Step 1: Add an eBook</h2>
		<h3>You may EITHER</h3>
			<input dojoType="dijit.form.RadioButton" name="handletype" checked="true" value="localupload" type="radio" />Upload local eBook file: <br />
			<input type="file" name="handle"/><br />
		<h3>OR </h3>
		<input dojoType="dijit.form.RadioButton" name="handletype" checked="false" value="remoteselect" type="radio" />Select from incoming directory(coming soon):<br />
		<ul id="remotelist"></ul>
	</div>
	<div class="box">
		<h2>Step 3: Attach tags</h2>
		Tags:
		<input type="text" class="vTextField" name="tags" value=""/><br />
		<a onclick="suggestTags()">Suggest by Yahoo!:</a>
		<ul id="suggestedtags"></ul>
	</div>
</div>
<div class="twothird box">
	<h2>Step 2: Link with meta data</h2>
	Search ISBN or keywords<br/>
	<div>
		<div class="twothird">
			<input type="text" id="search" class="vTextField" name="search" size="30" value=""/>
			<input type="button" id="btn_search" value="Search" />
		</div>
		<div id="search-nav" class="third align-right hide">
			<div id="prev" class="nav"><a onclick="searchPrev()">Previous</a></div> | 
			<div id="next" class="nav"><a onclick="searchNext()">Next</a></div>
		</div>
	</div>
	
	<ul id="thumbnails"></ul>
</div>
<br clear="all">
<div class="submit-row">
	<input type="submit" value="Save and add another" name="_addanother"  />
	<input type="submit" value="Save and continue editing" name="_continue" />
	<input type="submit" value="Save" class="default" />
</div>

{% endblock %}
